<!Doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <title>购物车-卡西欧官方商城-卡西欧官方网站</title>
  <link rel="stylesheet" href="./fonts/demo.css">
  <link rel="stylesheet" href="./fonts/iconfont.css">
  <link rel="stylesheet" href="./css/bootstrap.css">
  <link rel="stylesheet" href="./css/cart.css">
  <link rel="shortcut icon" href="./image/logo.ico?a=2" />
  <script src="./js/jquery-3.6.0.js"></script>
  <script src="./js/tools.js"></script>
  <script src="./js/cookie.js"></script>
  <script src="./js/home.js"></script>
  <script src="./js/layer.js"></script>
  <script src="./js/cart.js"></script>
 </head>
 <body>
    <!-- 头部 -->
    <div class="header">
        <div class="header-maddion">
            <ul>
                <li><a href=""><img src="./image/01.JPG" alt="">正品承诺</a></li>
                <li><a href="">常见问题</a></li>
                <li><a href="">产品注册</a></li>
                <li><a href="">发票说明</a></li>
                <li><a href="">卡西欧官网</a></li>
                <li class="ulest"><a href="./login.html">登录</a>
                    <a href="./register.html">注册</a>
                </li>
                <li><a href="">积分值</a></li>
                <li><a href="cart.html" class="glyphicon glyphicon-shopping-cart"> 购物车0</a></li>
            </ul>
        </div>
    </div>
    <!-- 导航栏 -->
    <div class="nav">
        <div class="nav-big">
            <div class="nav-left">
                <a href="">
                    <img src="https://statics6.casiostore.com.cn/publics/images/pc/casio-logo.png" alt="...">
                </a>
            </div>
            <div class="nav-maddion">
                <ul>
                    <li><a href="">手表</a></li>
                    <li><a href="">钟表</a></li>
                    <li><a href="">乐器</a></li>
                    <li><a href="">电子辞典</a></li>
                    <li><a href="">计算器</a></li>
                    <li><a href="">特殊限定款</a></li>
                    <li><a href="">配件</a></li>
                    <li><a href="">最新活动</a></li>
                    <li><a href="">个性定制</a></li>
                    <li><a href="">C's CLUB会员专区</a></li>
                </ul>
            </div>
            <div class="nav-right">
                <input type="text" value="MR-G系列" onkeydown="if (event.keyCode==20) {}"  onblur="if(this.value=='')value='MR-G系列';" onfocus="if(this.value=='MR-G系列')value='';" value="MR-G系列"/>
                <a href="" class="glyphicon glyphicon-search"></a>
            </div>
        </div>
    </div>
    <!-- 购物车 -->
    <div class="container cart">
        <table class="table">
            <thead>
                <tr>
                    <th><input type="checkbox" checked name="selectAll">全选</th>
                    <th>名称</th>
                    <th>图片</th>
                    <th>价格</th>
                    <th>数量</th>
                    <th width="80">小计</th>
                    <th>操作</th>
                </tr>
            </thead>
            <tbody>
                
            </tbody>
            <tfoot>
                <tr>
                    <td><input type="checkbox" checked name="selectAll">全选</td>
                    <td><button class="btn btn-danger clearCart">清空购物车</button></td>
                    <td colspan="2">商品总数量：<span class="totalNumber">0</span>件</td>
                    <td colspan="2">商品总价格：￥<span class="totalPrice"></span>元</td>
                    <td>
                        <a href="" class="btn btn-primary">结算</a>
                    </td>
                </tr>
            </tfoot>
        </table>
    </div>
    <!-- 底部 -->
    <div class="tab">
        <div class="tab-md">
                <i><a href="" class="iconfont"><span>&#xe63a;</span>正品保证</a></i>
                <i><a href="" class="iconfont"><span>&#xe629;</span>个性定制</a></i>
                <i><a href="" class="iconfont"><span>&#xe69e;</span>全场免邮</a></i>
                <i><a href="" class="iconfont"><span>&#xe670;</span>积分商城</a></i>
                <i><a href="" class="iconfont"><span>&#xe61b;</span>专业售后</a></i>
        </div>
    </div>
    <!-- 尾部 -->
    <div class="footer">
        <div class="footer-md">
            <!--帮助中心-->
            <div class="footer-help">
                    <h6><a href="">帮助中心</a></h6>
                <div class="footer-sm">
                    <ul>
                        <p>新手指南</p>
                        <li><a href="">注册新用户</a></li>
                        <li><a href="">网站订购流程</a></li>
                        <p style="padding-top: 15px;">如何付款退款</p>
                        <li><a href="">支付方式</a></li>
                        <li><a href="">发票制作说明</a></li>
                        <li><a href="">如何办理退款/a></li>
                    </ul>
                </div>
                <div class="footer-sm">
                    <ul>
                        <p>配送方式</p>
                        <li><a href="">配送范围及配送时间</a></li>
                        <li><a href="">配送费收取标准</a></li>
                        <p style="padding-top: 15px;">售后服务</p>
                        <li><a href="">退换货政策</a></li>
                        <li><a href="">如何办理退货</a></li>
                        <li><a href="">保修服务</a></li>
                    </ul>
                </div>
                <div class="footer-sm">
                    <ul>
                        <p>自助查询</p>
                        <li><a href="">常用自助服务</a></li>
                        <li><a href="">热点问题</a></li>
                        <li><a href="">网站地图</a></li>
                        <li><a href="">产品问题帮助</a></li>
                        <li><a href="">产品说明书</a></li>
                        <li><a href="">产品操作视频</a></li>
                        <li><a href="">定制图案及文字说明细则</a></li>
                    </ul>
                </div>
                <div class="footer-sm">
                    <ul>
                        <p>其他</p>
                        <li><a href="">交易条款</a></li>
                        <li><a href="">关于我们</a></li>
                    </ul>
                </div>
            </div>
            <!--友情链接-->
            <div class="footer-link">
                <h6><a href="">友情链接</a></h6>
                <div class="footer-col" style="margin-left: 75px;">
                    <ul>
                        <li><a href="">卡西欧官网</a></li>
                        <li><a href="">卡西欧G-SHOCK</a></li>
                        <li><a href="">卡西欧电子教育</a></li>
                        <li><a href="">卡西欧计算器</a></li>
                    </ul>
                </div>
                <div class="footer-col">
                    <ul>
                        <li><a href="">卡西欧电子乐器</a></li>
                        <li><a href="">卡西欧手表</a></li>
                        <li><a href="">快递查询</a></li>
                    </ul>
                </div>
            </div>
            <!--C`sCLUB-->
            <div class="footer-club">
                <h6><a href="">C`s CLUB</a></h6>
                    <ul>
                        <li><a href="">定制服务</a></li>
                        <li><a href="">积分商城</a></li>
                        <li><a href="">试用中心</a></li>
                        <li><a href="">卡西欧头条</a></li>
                    </ul>
            </div>
            <!--底部 footer 咨询电话 在线客服 二维码-->
            <div class="footer-con">
                <div class="footer-con-a">
                    <div class="footer-con-b">
                        <div class="footer-con-c">
                            <i class="iconfont">&#xe604;</i>
                        </div>
                        <div class="footer-con-d">
                            <span>咨询电话</span><br />
                            <span>400-700-6655</span>
                        </div>
                    </div>
                    <div class="footer-con-b">
                        <div class="footer-con-d">
                            <span>周一到周日9:00 - 18:00</span><br />
                            <span>（国定假日除外）</span>
                        </div>   
                    </div>
                </div>
                <div class="footer-con-a"style="width: 350px;">
                    <div class="footer-con-b">
                        <div class="footer-con-c">
                            <i class="iconfont" style="padding-left: 20px;">&#xe61b;</i>
                        </div>
                        <div class="footer-con-d">
                            <span style="line-height:50px;">在线客服</span>
                        </div>
                    </div>
                    <div class="footer-con-b">
                        <div class="footer-con-d">
                            <span>周一到周日9:00 - 21:00</span><br />
                            <span>（国定假日除外）</span>
                        </div>   
                    </div>
                </div>
                <div class="footer-con-a" style="width: 263px;">                   
                    <div class="footer-con-b">
                        <i style="padding-left: 30px;"><img src="./image/qrcode.jpg" alt=""></i>
                        <div class="footer-con-d" style="float: right; margin-left: 10px;">
                            <span style="text-align: center;">手机访问</span><br />
                            <span>卡西欧官方商城</span>
                        </div>   
                    </div>
                </div>
                <div class="footer-con-a" style="width: 263px; border-right: none;">                   
                    <div class="footer-con-b">
                        <i style="padding-left: 20px;"><img src="./image/qrcode-public.png" alt=""></i>
                        <div class="footer-con-d" style="float: right; margin-left: 10px;">
                            <span>扫码关注卡西欧</span><br />
                            <span>官方商城微信</span>
                        </div>   
                    </div>
                </div>
            </div>
        </div>
         <!--京ICP 备案-->
        <div class="footer-pull">
            <a href="">京ICP备 10009123号-10</a>
            <a href=""><img src="./image/business_license_icon.png" alt=""></a>
            <a href="" style="float: right;">www.casiostore.com.cn</a>
        </div>
    </div>
    <script type="text/javascript">
        var nav=document.querySelector('.nav');
	    window.onscroll =function(){
            var arr = document.documentElement.scrollTop || document.body.scrollTop;
            if( arr>=40){
                nav.style.position = "fixed";
                nav.style.top = "0px";
            }else{
                nav.style.position = "relative";
            }
        }
    </script>
 </body>
</html>